<!--
 * @Author: your name
 * @Date: 2022-03-29 17:57:18
 * @LastEditTime: 2022-03-31 17:42:33
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: /CMS/src/views/cms/index/components/module3.vue
-->
<template>
  <div class="content1">
    <div v-for="(item, index) in list" :key="index" class="menuItem" @click="getRouterPush(item)">
      <SvgIcon :icon-class="item.icon" class="icon_Svg" />
      <p style="width:100%;">{{ item.title }}</p>
    </div>
  </div>
</template>
<script>
import SvgIcon from '@/components/SvgIcon/index'

export default {
  components: {
    SvgIcon
  },
  data() {
    return {
      list: [
        {
          icon: 'model3_1',
          title: '检测管理'
        },
        {
          icon: 'model3_2',
          title: '缺陷管理'
        },
        {
          icon: 'model3_3',
          title: '统计报告'
        },
        {
          icon: 'model3_4',
          title: '综合分析'
        },
        {
          icon: 'model3_5',
          title: '配置管理'
        }
      ]
    }
  },
  methods: {
    getRouterPush(data) {
      if (data.title === '统计报告') {
        return this.$router.push('/cms/statistical-report/statistical-report-forms/DefectMonthStatistics')
      } else if (data.title === '配置管理') {
        return this.$router.push('/cms/configuration-management/warn-information')
      } else if (data.title === '分析管理') {
        return this.$router.push('/cms/analysis-management/defect-management/defectInfo')
	    } else if (data.title === '综合分析') {
        return this.$router.push('/cms/comprehensive-analysis/special-analysis/defectPillar')
      } else if (data.title === '检测管理') {
        return this.$router.push('/cms/check-management/check-plan/DetailedPlanManagement')
      } else if (data.title === '缺陷管理') {
        return this.$router.push('/defect-management/defectInfo')
      }
      this.$router.push(
        '/cms/check-management/check-plan/InspectionPlanManagementIndex'
      )
    }
  }
}
</script>
<style lang="scss" scoped>
.menuItem {
  width: 25%;
  height: 70px;
  margin: 0 10px 15px 15px;
  background: radial-gradient(
    50% 50% at 50% 50%,
    #162c6b 0%,
    #162c6b 41.9%,
    #1f3984 100%
  );
  text-align: center;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  cursor: pointer;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  color: #66ffff;
}

.content1 {
  width: 100%;
  height: 100;
  display: flex;
  padding: 20px;
  align-items: center;
  flex-wrap: wrap;
}
.icon_Svg {
  width: 35px;
  height: 35px;
  diplay: block;
  margin: 0 auto;
}
</style>
